<template>
	<view class="top-box">首页</view>
	<view class="home-content">
		<!--首页头部-->
		<view class="home-littop flex_fsc">
			<image :src="setting.oss_pub_domain + '/app-img/home/icon.png'" class="top-img"></image>
			帮助教练建立智能教学体系 ，智能学员管理
		</view>
		<!--首页导航-->
		<view class="home-dh flex_sb">
			<navigator url="/pages/tabbar-page/tabbar-1" open-type="switchTab" class="home-dh-list" hover-class="none">
				<image :src="setting.oss_pub_domain + '/app-img/home/icon01.png'" class="icon-size"></image>
				<view class="home-dh-number">{{ headerData.studentCount }}</view>
				<view class="home-dh-status uni-color-grey">学员</view>
			</navigator>
			<navigator url="/pages/player/evaluation/evaluation" class="home-dh-list" hover-class="none">
				<image :src="setting.oss_pub_domain + '/app-img/home/icon02.png'" class="icon-size"></image>
				<view class="home-dh-number">{{ headerData.evaluationCount }}</view>
				<view class="home-dh-status uni-color-grey">测评</view>
			</navigator>
			<navigator url="/pages/question/index?all=1" class="home-dh-list" hover-class="none">
				<image :src="setting.oss_pub_domain + '/app-img/home/icon03.png'" class="icon-size"></image>
				<view class="home-dh-number">{{ headerData.questionCount }}</view>
				<view class="home-dh-status uni-color-grey">学员问题</view>
			</navigator>
			<navigator url="/pages/course/schedule/schedule" hover-class="none" class="home-dh-list">
				<image :src="setting.oss_pub_domain + '/app-img/home/icon04.png'" class="icon-size"></image>
				<view class="home-dh-number">{{ headerData.courseCount }}</view>
				<view class="home-dh-status uni-color-grey">即将开课</view>
			</navigator>
		</view>
		<!--添加学员/预约授课-->
		<view class="home-add flex_sb">
			<view class="home-add-left flex_cc" @click="addStudent">
				<view>
					<image :src="setting.oss_pub_domain + '/app-img/home/icon_add.png'"></image>
					<view>添加学员</view>
				</view>
			</view>
			<navigator
				url="/pages/player/teach-order/teach-order"
				class="home-add-left flex_cc home-add-right"
				hover-class="none"
			>
				<view>
					<image :src="setting.oss_pub_domain + '/app-img/home/icon_yy.png'"></image>
					<view>预约课程</view>
				</view>
			</navigator>
			<view class="home-add-left flex_cc" style="background: #5c64e6" @click="createScheme">
				<view>
					<image :src="setting.oss_pub_domain + '/pics/index_3.png'"></image>
					<view>积累方案</view>
				</view>
			</view>
			<view class="home-add-left flex_cc" style="background: #37cda5" @click="createQuestion">
				<view>
					<image :src="setting.oss_pub_domain + '/pics/index_4.png'"></image>
					<view>快速授课</view>
				</view>
			</view>
		</view>
		<navigator
			:url="setting.banner_dictExtF"
			v-if="setting.banner"
			class="home-banner uni-my-32"
			hover-class="none"
		>
			<image :src="setting.oss_pub_domain + setting.banner"></image>
		</navigator>
		
		<!--授课时间-->
		<view class="home-time">
			<view class="home-time-top flex_sbc">
				<view>
					<text class="lit">授课时间</text>
					<text class="month">{{ month }}月</text>
				</view>
				<navigator url="/pages/course/schedule/schedule" hover-class="none" class="more">更多时间</navigator>
			</view>
			<view class="home-time-rq flex_sbc">
				<text
					v-for="(date, index) in days"
					:key="date.day"
					:class="{ active: index === selDayIndex }"
					@click="getAppGiveLessonList(`${date.year}-${date.month}-${date.day}`, index)"
				>
					{{ date.day }}
				</text>
			</view>
			<view v-if="courseList.length" class="home-time-con">
				<view v-for="(course, cindex) in courseList" :key="course.id" class="home-time-list">
					<view class="home-time-list-top flex_fsc">
						<text>{{ course.beginTime.split(' ')[1].split(':').slice(0, 2).join(':') }}</text>
						<text v-if="course.status" class="status end">已完成</text>
						<text v-else-if="nowTimeStamp >= course.beginTimeStamp" class="status yq">已逾期</text>
						<text v-else class="status end">未开始</text>
						<view class="home-time-bt uni-color-main-bg uni-white" @click="teachButton(cindex)">授课</view>
					</view>
					<view class="home-time-list-con flex_fsc">
						<image :src="setting.oss_pub_domain + course.studentAvatar" class="user-head"></image>
						<view class="home-time-list-right">
							<view class="time-list-top flex_fsc uni-color-grey">
								<text class="u-line-1" style="max-width: 220rpx">{{ course.studentName }}</text>
								<text class="time-list-st"></text>
								<text>{{ course.hisAvg }}</text>
							</view>
							<view class="time-list-bottom uni-mt-14">{{ course.name }}</view>
						</view>
					</view>
				</view>
				<navigator url="/pages/course/schedule/schedule" hover-class="none" class="home-time-more flex_cc">
					<text>展开</text>
					<image :src="setting.oss_pub_domain + '/app-img/icon/ext-81A290.png'"></image>
				</navigator>
			</view>
			<z-no-data v-else placeholder="暂无课程"></z-no-data>
		</view>
		<!--学员提问-->
		<view class="home-time uni-mt-20">
			<view class="home-time-top flex_sbc">
				<view>学员提问</view>
				<navigator url="/pages/ask-questions/index?all=1" class="more" hover-class="none">更多</navigator>
			</view>
			<view v-if="askList.length" class="home-problem">
				<view v-for="ask in askList" class="home-problem-list flex_fs" @click="askDetials(ask)">
					<view class="user-head-view">
						<image class="user-head-problem" :src="setting.oss_pub_domain + ask.studentAvatar"></image>
						<view class="user-head-lable">问</view>
					</view>
					<view class="home-problem-con">
						<view class="home-problem-user u-line-1">{{ ask.studentName }}</view>
						<view class="home-problem-tit u-line-1">{{ ask.name }}</view>
						<view class="home-problem-label flex_fsc">
							<text class="ts">{{ ask.descriptionTagName }}</text>
						</view>
					</view>
				</view>
			</view>
			<z-no-data v-else placeholder="暂无提问"></z-no-data>
		</view>
	</view>
</template>

<script setup>
import { getConfig } from '@/api/common';
import { getHeader, getQuestionList } from '@/api/home.js';
import { appointmentGiveLessonsList, appointmentGiveLessonsDetail } from '@/api/course.js';
import { getTraineesList, getPlayerDetial } from '@/api/player.js';
import { onShow } from '@dcloudio/uni-app';
import { ref, reactive, getCurrentInstance } from 'vue';

const { proxy: that } = getCurrentInstance();

const courseList = ref([]),
	month = ref(''),
	days = ref([]),
	selDayIndex = ref(0);
const dateTime = new Date();
month.value = (dateTime.getMonth() + 1).toString().padStart(2, '0');
for (let i = 0; i < 7; i++) {
	if (i) dateTime.setDate(dateTime.getDate() + 1);
	days.value.push({
		day: dateTime.getDate().toString().padStart(2, '0'),
		month: (dateTime.getMonth() + 1).toString().padStart(2, '0'),
		year: dateTime.getFullYear().toString().padStart(2, '0')
	});
}
// 授课列表
const nowTimeStamp = ref(''),
	headerData = ref({}),
	questionList = ref([]);
function showFun() {
	if (uni.getStorageSync('token')) {
		getAppGiveLessonList(that.tools.formatDate('', 'YYYY-MM-DD'));
		nowTimeStamp.value = Date.parse(new Date());
		getHeader().then((res) => {
			headerData.value = res;
		});
		getQuestionList().then((res) => {
			questionList.value = res;
		});
		getTraineesList({ pageNum: 1, pageSize: 6 }).then((res) => {
			askList.value = res.rows;
		});
	}
}

defineExpose({ showFun });
function getAppGiveLessonList(beginTime, index) {
	selDayIndex.value = index || 0;
	appointmentGiveLessonsList({ beginTime, pageSize: 4 }).then((res) => {
		res.rows.forEach((item) => {
			item.beginTimeStamp = Date.parse(item.beginTime);
		});
		courseList.value = res.rows;
	});
}

// 授课按钮
async function teachButton(index) {
	const item = courseList.value[index];
	uni.showLoading({
		title: '正在获取课程信息'
	});
	const playerInfo = await getPlayerDetial(item.studentId);
	uni.setStorageSync('player-info', playerInfo);
	appointmentGiveLessonsDetail(item.courseId)
		.then((res) => {
			res.result = JSON.parse(res.result);
			uni.setStorageSync('edit-course', res);
			uni.hideLoading();
			uni.navigateTo({
				url: '/pages/course/details/details'
			});
		})
		.catch(() => {
			uni.hideLoading();
		});
}

const askList = ref([]);
async function askDetials(item) {
	uni.setStorageSync('ask-details', item);
	const playerInfo = await getPlayerDetial(item.relStudent);
	uni.setStorageSync('player-info', playerInfo);
	uni.navigateTo({
		url: '/pages/ask-questions/details/details'
	});
}

function createScheme() {
	uni.removeStorageSync('edit-scheme');
	uni.navigateTo({
		url: '/pages/scheme/add/add'
	});
}

function createQuestion() {
	uni.removeStorageSync('edit-question');
	uni.removeStorageSync('player-info');
	uni.navigateTo({
		url: '/pages/question/edit/create?selStudent=1&source=1'
	});
}

function addStudent() {
	uni.removeStorageSync('player-profile');
	uni.navigateTo({
		url: '/pages/player/add/add'
	});
}

// if (uni.getStorageSync('token'))
// 	setTimeout(() => {
// 		if (!that.userInfo.inviteCode) {
// 			that.tools.alert('您未绑定邀请码，请绑定！');
// 			uni.reLaunch({
// 				url: '/pages/index/bind-invitation-code'
// 			});
// 		}
// 	}, 2000);
</script>

<style lang="scss">
@import 'index.scss';
</style>
